<template>
    <div class="box">
        <div class="tablesize">
            <div>
                <el-button @click="allRefresh" type="primary" icon="el-icon-refresh">全部刷新</el-button>
                <el-button @click.stop="selectTeam(item)" type="text">下发数据</el-button>
            </div>
           <div class="home-body" style="margin-top:15px">
                <cvue-table
                :option="tableOption"
                :data="tableData"
                ref="tbl1"
                :isShowAdd="false"
                :page="page"
                :tablePage="tablePage"
                :pageSize="page.pageSize"
                :loading="tableLoading"
                @current-change="handleCurrentChange"
                @size-change="handleSizeChange"
                :isShowPage="true"
                >
               
                    <!-- 操作按钮 -->
                    <el-table-column
                        fixed="right"
                        slot="actionMenu"
                        label="操作"
                        align="center"
                        header-align="center"
                    >
                        <template slot-scope="scope">
                            <el-button v-if="scope.row.taskProgress == 100" @click="lookDetail(scope.row)" icon="el-icon-view">查看</el-button>
                            <el-button v-else  @click="refreshProgress(scope.row)" icon="el-icon-refresh">刷新</el-button>
                        </template>
                    </el-table-column>
                </cvue-table>
            </div>
        </div>
         <look-Task
        @closeDialog="closeDialog"
        @confirmDialog="confirmDialog"
        @handleClose="closeDialog"
        :dialogVisible="dialogVisible"
        :task='task'
        ></look-Task>

        <selectTeam></selectTeam>
        <selectDevice></selectDevice>
        <group></group>
        <addGroup></addGroup>
    </div>
</template>
<script>
import cvueTable from '@/components/cvue-table'
import lookTask from './lookTask'
import {mapState, mapGetters} from 'vuex'

import selectTeam from '../dorm/selectTeam'
import selectDevice from '../dorm/selectDevice'
import group from '../dorm/group'
import addGroup from '../dorm/addGroup'
export default {
    name: 'hah',
    components: {
        cvueTable, lookTask, selectTeam, selectDevice, group, addGroup
    },
    data () {
        return {
            task: {},
            dialogVisible: false,
            tableLoading: false,
            tablePage: 1,
            page: {
                total: 0, // 总页数
                currentPage: 1, // 当前页数
                pageSize: 10, // 每页显示多少条
                pageSizes: [10, 20, 50]
            },
            tableOption: {
                stripe: true,
                width: '100%',
                border: true,
                index: false,
                cloumn: [
                    { prop: 'taskCode', label: '任务编号', align: 'center' },
                    // { prop: 'taskContent', label: '任务内容', align: 'center' },
                    { prop: 'deviceSerialNum', label: '设备编号', align: 'center' },
                    { prop: 'deviceTypeName', label: '设备类型', align: 'center' },
                   // { prop: 'taskRemark', label: '备注', align: 'center', slotStatus: true },
                    { prop: 'taskProgress', label: '任务进度', align: 'center' }
                ]
            },
            tableData: []
        }
    },
    computed: {
        ...mapGetters(['cookiesObj'])
    },
    mounted () {
        this.getTask()
    },
    methods: {
        // 获取下发任务
        getTask () {
            this.tableLoading = true
            var params = {
                SchoolId: this.cookiesObj.schoolId,
                PageNum: this.page.currentPage,
                PageSize: this.page.pageSize
            }
            this.$store.dispatch('task/GetTask', params).then(
                res => {
                    this.tableData = res.items
                    this.page.total = res.totalCount
                    this.tableLoading = false
                }
            )
        },
        // 改变pagesize
        handleSizeChange (val) {
            this.page.currentPage = 1
            this.page.pageSize = val
            this.getTask()
        },
        // 改变页码
        handleCurrentChange (val) {
            this.page.currentPage = val
            this.getTask()
        },
        closeDialog () {
            this.dialogVisible = false
        },
        confirmDialog () {
            this.dialogVisible = false
        },
        // 查看 详情
        lookDetail (item) {
            this.dialogVisible = true
            this.task = item
        },
        // 刷新进度
        refreshProgress (item) {
            this.tableLoading = true
            var params = {
                vmsTaskSeriesIds: item.vmsTaskSeriesId
            }
            this.$store.dispatch('task/RefreshProgress', params).then(
                res => {
                    if (res.status == 200) {
                        this.tableData.forEach(item2 => {
                            if (item2.vmsTaskSeriesId == item.vmsTaskSeriesId) {
                                item2.taskProgress = res.data[0].importStatus
                                this.tableLoading = false
                            }
                        })
                    }
                }
            )
        },
        // 全部刷新
        allRefresh () {
            var arr = []
            this.tableData.forEach(
                item => {
                    arr.push(item.vmsTaskSeriesId)
                }
            )
            this.tableLoading = true
            var params = {
                vmsTaskSeriesIds: arr.join()
            }
            this.$store.dispatch('task/RefreshProgress', params).then(
                res => {
                    if (res.status == 200) {
                        this.tableData.forEach(item => {
                            res.data.forEach(
                                item2 => {
                                    if (item.vmsTaskSeriesId == item2.vmsTaskSeriesId) {
                                        item.taskProgress = item2.importStatus
                                    }
                                }
                            )
                        })
                    }
                    this.tableLoading = false
                }
            )
        },
        selectTeam (item) {
            this.$store.state.dorm.curDorm = item
            this.$store.state.dorm.selectTeamVisible = true
        }
    }
}
</script>
<style scoped>
    .box{
      
        background:#fff;
    }
    .bar{
        display: flex;
        justify-content: space-between
    }
    .bar-p{width:650px;height: 300px;}
    .tablesize{
        margin-top: 30px;
    }
</style>
